import './App.css';
import {HashRouter as Router, Link, Route, Redirect, Switch} from './react-router-dom';
import Home from './components/Home';
import Profile from './components/Profile';
import User from './components/User';
import Home12 from "./components/Home12";

function App() {
  return (
    <div className="App">
      <Router>
          <>
              <div>
                  <Link to={"/home"}>主页</Link>
                  <Link to={"/profile"}>配置</Link>
                  <Link to={"/user"}>用户</Link>
              </div>
              <div>
                  {/*
                    exact 严格匹配
                    路由/home/123不会加载/home的组件
                  */}
                  <Switch>
                      <Route path="/home" exact={true} component={Home} />
                      <Route path="/home/123" component={Home12} />
                      <Route path="/profile" component={Profile} />
                      <Route path="/user" component={User} />
                      <Redirect to="/home" />
                  </Switch>
              </div>
          </>
      </Router>
    </div>
  );
}

export default App;
